<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>ting Manager</title>
    <link href="/css/bootstrap.css" rel="stylesheet">
</head>
<body>
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="/">Ting</a>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="/course">课程</a></li>
                <li><a href="/upload">上传文件</a></li>
                <li><a href="/user">用户管理</a></li>
                <li><a href="/comment">评论</a></li>
            </ul>
        </div>
    </div>
</nav>
<div class="panel panel-default">
    <div class="panel-heading">
        <h2 class="panel-title" style="margin-left: 20px">添加课程</h2>
    </div>
    <div class="panel-body">
        <form class="form-horizontal" method="post" action="/course">
            <div class="form-group">
                <label for="title" class="col-sm-2 control-label">课程标题:</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="title" name="title" placeholder="title">
                </div>
            </div>
            <div class="form-group">
                <label for="subtitle" class="col-sm-2 control-label">课程副标题:</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="subtitle" name="subtitle" placeholder="subtitle">
                </div>
            </div>
            <div class="form-group">
                <label for="author" class="col-sm-2 control-label">作者:</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="author" name="author" placeholder="author">
                </div>
            </div>
            <div class="form-group">
                <label for="cover" class="col-sm-2 control-label">封面:</label>
                <div class="col-sm-8">
                    <input type="text" class="form-control" id="cover" name="cover" placeholder="cover url">
                </div>
            </div>
            <div class="form-group">
                <label for="description" class="col-sm-2 control-label">描述:</label>
                <div class="col-sm-8">
                    <textarea class="form-control" rows="3" id="description" name="description" placeholder="description"></textarea>
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">添加</button>
                </div>
            </div>
        </form>
    </div>
</div>
<div class="jumbotron" style="padding-left: 30px;padding-right: 30px">
    <div class="row">
        <% for(var i = 0, course; course = courses[i++];) { %>
        <div class="col-md-3 col-lg-3 col-sm-4 col-sm-6">
            <div class="thumbnail">
                <img src="<%= course.cover %>" alt=" <%= course.name %>">
                <div class="caption">
                    <h3 style="white-space: nowrap; width: 100%; overflow: hidden;"><%= course.title %></h3>
                    <h5><%= course.subtitle %></h5>
                    <h4><%= course.author %></h4>
                    <h5><%= course._id %></h5>
                    <p style="display: -webkit-box;-webkit-line-clamp:4; -webkit-box-orient: vertical; overflow: hidden;-ms-text-overflow: ellipsis;text-overflow: ellipsis;"><%= course.description.slice(0,100) + '...' %></p>
                    <p>
                        <a href="<%= `/course/${course._id}/voice` %>" class="btn btn-primary" role="button">发布音频</a>
                    </p>
                </div>
            </div>
        </div>
        <% } %>
    </div>
</div>
</body>
<script src="/js/jquery.js"></script>
<script src="/js/bootstrap.js"></script>
</html>